<!DOCTYPE html>
<html lang="zh-CN">
<#import "/spring.ftl" as sp />
<#assign base=request.contextPath />
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,height=device-height,initial-scale=1.0">
    <meta name="keywords" content=${(post.keyword)!"kaibb"}>
    <base id="base" href="${base}/">
    <!-- Bootstrap -->
    <style>

        #menu {
            margin: 0;
            padding: 0;
            position: fixed;
            left: 10px;
            top: 10px;
            list-style-type: none;
            z-index: 70;
        }

        #menu li {
            float: left;
            margin: 0 10px 0 0;
            font-size: 14px;
        }

        #menu a {
            float: left;
            padding: 10px 20px;
            background-color: #fff;
            color: #333;
            text-decoration: none;
        }

        #menu .active a {
            color: #fff;
            background-color: #333;
        }

        .section {
            text-align: center;
            font: 50px "Microsoft Yahei";
            color: #fff;
        }

    </style>
    <link rel="stylesheet" href="${base}/plugin/animate/animate.css">
    <link rel="stylesheet" type="text/css" href="${base}/plugin/fullpage/jquery.fullpage.css"/>
    <script src="${base}/plugin/jquery/jquery.min.js"></script>
    <script type="text/javascript" src="${base}/plugin/fullpage/jquery.fullpage.js"></script>
    <script type="text/javascript" src="${base}/js/demo/fullpage/hello.js"></script>
    <title>Hello FullPage</title>
</head>
<body>
<#--<ul id="menu">
    <li data-menuanchor="firstPage" class="active"><a href="${base}/demo/fullpage/hello#firstPage">First section</a>
    </li>
    <li data-menuanchor="secondPage"><a href="${base}/demo/fullpage/hello#secondPage">Second section</a></li>
    <li data-menuanchor="thirdPage"><a href="${base}/demo/fullpage/hello#thirdPage">Third section</a></li>
    <li data-menuanchor="fourthPage"><a href="${base}/demo/fullpage/hello#fourthPage">Fourth section</a></li>
</ul>-->
<div id="fullpage">
    <div class="section">
        <h3 class="animated  bounce">这是第一屏</h3>
        <p class="animated flipInY">fullPage.js — 基本演示</p></div>
    <div class="section"><h3 class="animated  bounce">这是第二屏</h3></div>
    <div class="section"><h3>这是第三屏</h3>
        <p class="animated flipInY">fullPage.js — 基本演示</p></div>
    <div class="section"><h3>这是第四屏</h3></div>
    <div class="section">
        <div class="slide" data-anchor="slide1"> Slide 1</div>
        <div class="slide" data-anchor="slide2"> Slide 2</div>
        <div class="slide" data-anchor="slide3"> Slide 3</div>
        <div class="slide" data-anchor="slide4"> Slide 4</div>
    </div>
</div>
</body>
</html>